<!DOCTYPE html>
<!--
  ~ Date：11/11/18 1:10 PM 
  ~ Author: guomw
  ~
  -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>我的订单</title>

    <link rel="stylesheet" href="http://cdn.viptool.cn/lib/bootstrap/3.3.5/css/bootstrap.min.css">
    <link href="../../resource/hotui/css/font-awesome.min.css" th:href="@{/resource/hotui/css/font-awesome.min.css}" rel="stylesheet">
    <!-- Morris -->
    <link href="http://cdn.viptool.cn/lib/morris.js/0.4.3/morris.css" rel="stylesheet">
    <link href="http://cdn.viptool.cn/lib/animate.css/2.1.1/animate.min.css" rel="stylesheet">
    <link href="../../resource/hotui/css/style.min-1.0.8.css" th:href="@{/resource/hotui/css/style.min-1.0.8.css}" rel="stylesheet">
    <link href="../../resource/hotui/css/hotui.style.override.css" th:href="@{/resource/hotui/css/hotui.style.override.css}" rel="stylesheet"/>
    <!--checkbox-->
    <link href="http://cdn.viptool.cn/lib/awesome-bootstrap-checkbox/0.3.5/awesome-bootstrap-checkbox.min.css" rel="stylesheet">
    <!--datetimepick-->
    <link href="http://cdn.viptool.cn/lib/bootstrap-daterangepicker/2.1.25/daterangepicker.min.css" rel="stylesheet">
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight tooltip-demo">
    <div class="col-lg-12">
        <div class="ibox float-e-margins" style="margin-bottom:0;">
            <div class="ibox-title" style="padding: 14px 15px 11px;">
                <div class="form-inline">
                    <div class="form-group m-r-sm">
                        <label style="font-size: 17px; margin-top: 5px;">订单-<span th:text="${order.orderId}"></span>
                            <span style="color:#f7a54a;font-size:13px;font-weight:normal" th:text="${order.getAuditStatusDesc()}">待审核</span>
                            <span style="color:#1a7bb9;font-size:13px;font-weight:normal" th:text="${order.getStatusDesc()}">待发货</span>
                        </label>
                    </div>
                    <div class="form-group m-r-sm" style="float: right; ">
                        <label class=" control-label">订单状态操作：</label>
                        <button id="ucOrderActBar_btnPayed" type="button" class="btn btn-warning btn-sm" data-toggle="modal" data-target="#addOrderExpressModal" th:if="${order.getAuditStatus()==1&&order.getStatus()==0}">发货</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <ul class="nav nav-tabs">
        <li class="active">
            <a th:href="@{/order/detail(orderId=${order.orderId})}" href="user_detail.html">基本信息</a>
        </li>
        <li>
            <a th:href="@{/order/detail/log(orderId=${order.orderId})}" href="user_detail_auth.html">订单日志</a>
        </li>
    </ul>
    <!--商品兴趣-->
    <div>
        <div> 商品列表：</div>
        <div class="ibox-content">
            <table class="table table-bordered table-hover table-center">
                <thead>
                <tr>
                    <th>商品编号</th>
                    <th>商品名称</th>
                    <th>价格</th>
                    <th>购买数量</th>
                    <th>小计</th>
                </tr>
                </thead>
                <tbody id="table-content">
                <tr th:each="row,index:${orderItems}">
                    <td th:text="${row.goodsId}"></td>
                    <td th:text="${row.name}"></td>
                    <td th:text="${row.price}"></td>
                    <td th:text="${row.nums}"></td>
                    <td th:text="${row.amount}"></td>
                </tr>
                </tbody>
            </table>
        </div>
        <div>订单详情</div>
        <div class="ibox-content">
            <table class="table table-bordered">
                <tbody>
                <tr>
                    <th>订单号：</th>
                    <td th:text="*{order.orderId}">2018</td>
                    <th>总金额：</th>
                    <td th:text="*{order.totalAmount}">0</td>
                </tr>
                <tr>
                    <th>下单时间：</th>
                    <td>
                        <span th:text="*{#temporals.format(order.createTime,'yyyy-MM-dd HH:mm:ss')}">2018-09-30</span>
                    </td>
                    <th>支付时间：</th>
                    <td>
                        <span th:text="*{#temporals.format(order.payTime,'yyyy-MM-dd HH:mm:ss')}">2018-09-30</span>
                    </td>
                </tr>
                <tr>
                    <th>实付金额：</th>
                    <td th:text="${order.totalAmount}"></td>
                    <th>优惠金额：</th>
                    <td th:text="${order.pmtAmount}"></td>
                </tr>
                <tr>
                    <th>收货人：</th>
                    <td th:text="*{order.shipName}">--</td>
                    <th>收货人电话：</th>
                    <td th:text="*{order.shipMobile}">--</td>
                </tr>
                <tr>
                    <th>收货地址：</th>
                    <td colspan="3" th:text="*{order.shipAddr}">浙江省/杭州市/滨江区</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
<modal th:include="template/modal::addOrderExpressModal"></modal>

<script src="http://cdn.viptool.cn/lib/jquery/2.2.4/jquery.min.js"></script>
<script src="http://cdn.viptool.cn/lib/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="../../resource/hotui/js/hot/bootstrap.hot.extra-utils.js?20190316" th:src="@{/resource/hotui/js/hot/bootstrap.hot.extra-utils.js?20190316(123123)}"></script>
<script src="../../resource/hotui/js/hot/bootstrap.hot.extra-init.js?20190316"></script>
<script src="../../resource/hotui/js/content.min.js" th:src="@{/resource/hotui/js/content.min.js}"></script>

<!--日期选择-->
<script src="http://cdn.viptool.cn/lib/moment.js/2.19.2/moment.min.js"></script>
<script src="../../resource/hotui/js/plugins/datetimepick/js/daterangepicker.js" th:src="@{/resource/hotui/js/plugins/datetimepick/js/daterangepicker.js}"></script>
<!--file-->
<script src="../../resource/hotui/js/plugins/prettyfile/bootstrap-prettyfile.js"></script>

<script src="../../resource/hotui/js/plugins/SearchableSelect/jquery.searchableSelect.js"></script>
<script>
    var orderId = '[[${order.orderId}]]';
    var jsHelper = {
        init: function () {
            hotUtil.ajaxCall("/order/ajax/expressList", null, function (ret) {
                if (ret.resultCode === 2000) {
                    var tempHtml = "";
                    $.each(ret.data, function (i, item) {
                        tempHtml += '<option value="' + item.expressCode + '">' + item.expressName + '</option>';
                    });
                    $("#expressCompanyName").html(tempHtml);
                }
            })
        },
        btnSubmit: function () {
            if (hotUtil.isNullOrEmpty($("#expressNo").val())) {
                swal("请填写快递单号", "", "error");
                return false;
            }
            var param = {
                expressCompanyName: $("#expressCompanyName").find("option:selected").text(),
                expressCompanyCode: $("#expressCompanyName").val(),
                expressNo: $("#expressNo").val(),
                orderId: orderId
            }
            hotUtil.ajaxCall("/order/ajax/modifyDeliveryStatus", param, function (ret) {
                if (ret.resultCode === 2000) {
                    swal({
                        title: "发货成功",
                        type: "success"
                    }, function () {
                        window.location.reload();
                    });
                }
            })
        }
    }
    $(function () {
        jsHelper.init();
    });
</script>
</body>
</html>